import React from 'react';
import { Card } from 'choerodon-ui';
import { connect } from 'dva';
import styles from './style.less';
import CoreCircle from './CoreCircle';

class CoreMaterials extends React.Component {

  // eslint-disable-next-line no-useless-constructor
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    const { dispatch } = this.props;
    dispatch({
      type: 'produceDashboard/fetchCoreMaterials',
    });
  }

  render() {
    const { coreData } = this.props.produceDashboard;
    return (
      <Card bordered={false}>
        <div className={styles['core-materials']}>
          <div className={styles['core-title']}>
            核心物料库存水平
          </div>
          <div className={styles['core-part']}>
            {
              coreData.map(item => <CoreCircle {...item} />)
            }
          </div>
        </div>
      </Card>
    );
  }
}

export default connect(
  ({ produceDashboard }) => ({
    produceDashboard,
  })
)(CoreMaterials);
